<!-- 添加银行卡 -->
<template>
	<view class="container">
		<view class="cut"></view>
		<view class="cell">
			<text>姓名</text>
			<input type="text" disabled="ture" placeholder="姓名" maxlength="18" v-model="data.real_name" />
		</view>
		<view class="cell">
			<text>身份证号码</text>
			<input type="text" disabled="ture" placeholder="身份证号码" maxlength="18" v-model="data.idcard"/>
		</view>
		<view class="cell" @tap="select">
			<text>开户银行名称</text>
			<input type="text" disabled placeholder="请选择开户银行名称" v-model="data.bank_name"/>
		</view>
		<view class="cell">
			<text>银行卡账号</text>
			<input type="number" placeholder="请输入银行卡账号" v-model="data.bank_number"/>
		</view>
		<view class="loginBtn" @tap="act&&bankBind()" :class="act? 'active' : ''">
			提 交
		</view>
	</view>
</template>

<script>
	import {
		bankBind
	} from "@/api/user.js"
	export default {
		data() {
			return {
				bankName: false,
				backurl: false,
				data: {
					real_name: "",
					idcard: "",
					bank_number: "",
					bank_name: '',
				},
				act: false
			};
		},
		onLoad(options) {
			if (options.backurl) {
				this.backurl = true
			}
			this.data.real_name = uni.getStorageSync("userInfo").real_name
			this.data.idcard = uni.getStorageSync("userInfo").card_id
		},
		onShow() {
			let pages = getCurrentPages();
			let currPage = pages[pages.length - 1];
			if (currPage.selectBank) { //选择银行
				this.data.bank_name = currPage.bank_name;
			}
		},
		watch: {
			data: {
				deep: true,
				handler(val, oldval) {
					this.blur();
				}
			}
		},
		methods: {
			//选择银行名称
			select() {
				uni.navigateTo({
					url:"/pages/center/accountSet/bank/selectBank"
				})
			},
			blur() {
				if (this.data.real_name && this.data.idcard && this.data.bank_number && this.data.bank_name) {
					this.act = true
				}
			},
			bankBind() {
				let _this = this
				uni.showLoading({
					mask:true
				})
				_this.data.bank_number = _this.data.bank_number.replace(/\s/g, "")
				bankBind(_this.data).then(res => {
					uni.hideLoading()
					uni.showModal({
						content:"绑定成功",
						showCancel:false,
						success:function() {
							let info = uni.getStorageSync('userInfo')
							info.is_bind_bank = 1
							uni.setStorageSync('userInfo',info)
							if (_this.backurl) {
								if (!uni.getStorageSync("userInfo").withdraw_pass) {
									uni.redirectTo({
										url: "/pages/center/accountSet/payPassword/payPassword?backurl=true"
									})
									return
								} else {
									uni.navigateBack({
										
									})
								}
								
							} else {
								uni.navigateBack({
									
								})
							}
							
						}
					})
				})
			}

		}
	};
</script>

<style lang="scss" scoped>
	.container{
		padding: 0 60rpx;
		.cut{
			width: 750rpx;
			height: 20rpx;
			background-color: #eee;
			margin-left: -60rpx;
		}
		.cell {
			height: 50rpx;
			border-bottom: 1rpx solid rgba(220, 220, 220, 1);
			margin-top: 76rpx;
			padding: 14rpx;
			font-size: 32rpx;
			position: relative;
					
			text {
				position: absolute;
				top: -30rpx;
				font-size:28rpx;
				color:rgba(51,51,51,1);
				}
		}
		
		.loginBtn {
			margin: 200rpx auto 0;
			width:600rpx;
			height:80rpx;
			border-radius:40px;
			background: rgba(220, 220, 220, 1);
			border-radius: 40rpx;
			line-height: 80rpx;
			text-align: center;
			color: #ffffff;
			font-size: 32rpx;
			font-weight: bold;
		}
		
		
		.active {
			background-color: $theme-color;
		}
	}
	
</style>
